<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <link rel="icon" href="https://github.com/fluidicon.png" type="image/png">
    <title>Air - Expro</title>    
     
    <!-- Bootstrap core CSS-->      
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
  
    <!-- Page level plugin CSS-->
    <link rel="stylesheet" href="http://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css" >

    <!-- Custom styles for this template -->
    <link rel="stylesheet" href="css/dashboard.css" >    
  </head>
  <body>
      <nav class="navbar navbar-dark fixed-top bg-dark flex-md-nowrap p-0 shadow">
                <a class="navbar-brand col-sm-3 col-md-2 mr-0" href="#">Express Pro</a>        
                <ul class="navbar-nav px-3">
                  <li class="nav-item text-nowrap">
                    <a class="nav-link" href="./about.html">About</a>
                  </li>
                </ul>
      </nav>
      <div class="container-fluid">
          <div class="row">
              <!-- sidebar -->
              <nav class="col-md-2 d-none d-md-block bg-light sidebar">
                  <div class="sidebar-sticky">
                      <ul class="nav flex-column">
                        <li class="nav-item">
                          <a class="nav-link " target="_blank" href="./index.html">
                            <span data-feather="home"></span>
                            Express 
                          </a>
                        </li>
                        <li class="nav-item  ">
                          <a class="nav-link active" href="./air.html">
                            <span data-feather="send"></span>
                            Air <span class="sr-only">(current)</span>
                          </a>
                        </li>
                        <li class="nav-item">
                          <a class="nav-link" href="./document.html">
                            <span data-feather="file"></span>
                            Document
                          </a>
                        </li>
                        <li class="nav-item">
                          <a class="nav-link" href="./country.html">
                            <span data-feather="map"></span>
                            Country
                          </a>
                        </li>
                        <li class="nav-item">
                          <a class="nav-link" href="./expressrate.html">
                            <span data-feather="bar-chart-2"></span>
                            Express Rate
                          </a>
                        </li>
                        <li class="nav-item">
                          <a class="nav-link" href="./airrate.html">
                            <span data-feather="layers"></span>
                            Air Rate
                          </a>
                        </li>
                      </ul>
                    </div>
                </nav>
                <!-- sidebar End -->
                
                <main role="main" class="col-md-9 ml-sm-auto col-lg-10 px-4">            
                  <h4>Air</h4>
                  <!-- table-responsive -->          
                  <div class="table-responsive">
                        <table class="table table-striped table-hover table-sm "  id="airproducttable" > 
                          <!--  加载空运货物列表.  -->
                        </table>
                  </div>                 
                  <hr>
               
                  <h6>从产品库中选择装箱，或<button  id="btnariaddrow" >Add Row</button>加入自定义重量尺寸。</h6>
                    <div class="table-responsive">
                      <table class="table table-striped table-sm table-hover table-sm "  id="airselecttable" >
                      <!--  加载空运选择货物列表.  -->
                      </table>
                    </div> 
  
                  
                      <div class="col-md-5 mb-3">
                              <div class="input-group mb-3" name="divairsearch" >                                 
                                      <input type="text" class="form-control" id="inputcitySearch" placeholder="Search"  >
                              </div>
                          
                      </div>
                      <div class="col-md-5 mb-3">
                          <div class="input-group mb-3">
                   
                          <select class="custom-select" id="cityselect">
                              <option selected>Choose...</option>
                              <option value="1">One</option>
                              <option value="2">Two</option>
                              <option value="3">Three</option>
                          </select>
                          <button class="btn btn-outline-primary" data-toggle="modal" data-target="#airrateModal" >Submit  </button>
                          </div>
                      </div>
                      <div class="col-md-5 mb-3">
                      
                      </div>
                                    
                  <!-- Table End -->
        
              <!-- Sticky Footer -->
              <footer class="sticky-footer">
                <div class="container my-auto">
                  <div class="copyright text-center my-auto">
                      <span>Copyright © Expro - SIUI  2019</span>
                  </div>
                </div>
              </footer>
            
            </main>
          </div>
        </div>
        
                
        
           <!-- Modal-->
   <div class="modal fade" id="airrateModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div id="airmodalDialog" class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title capitalize" id="airrateModalLabel" >Ready to Leave?</h5>
                    <button class="close" type="button" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">×</span>
                    </button>
                </div>
                <div class="modal-body">            
                    <div class="form-group row">
                        <label for="txtairweight" class="col-sm-3 col-form-label col-form-label-sm">Weight(kgs)</label>
                        <div class="col-sm-7">
                            <input type="text" class="form-control" id="txtairweight" placeholder="" value="" required>                             
                        </div>
                    </div>
                    <div class="form-group row">
                        <label for="txtairamount" class="col-sm-3 col-form-label col-form-label-sm">Amount(usd)</label>
                        <div class="col-sm-7">
                            <input type="text" class="form-control" id="txtairamountupten" placeholder="" value="" required>                             
                        </div>                       
                    </div>
                    <div class="form-group row">
                        <label for="txtairbattery" class="col-sm-3 col-form-label col-form-label-sm">Battery(usd)</label>
                        <div class="col-sm-7">
                            <input type="text" class="form-control" id="txtairamountbattery" placeholder="" value="" required>                             
                         </div>
                    </div> 
                    <div class="form-group row">
                      <label for="txtupdatedate" class="col-sm-3 col-form-label col-form-label-sm">Update Date</label>
                      <div class="col-sm-7">
                          <input type="text" class="form-control" id="txtupdatedate" placeholder="" value="" required>                             
                       </div>                 
                      </div>
                </div>
                <div class="modal-footer">
                    <button class="btn btn-outline-primary" type="button" data-dismiss="modal">关闭</button>                      
                </div>
            </div>
        </div>
    </div>
  <!-- Modal END --> 
          
        <!-- /.container -->
        <script src="https://cdnjs.cloudflare.com/ajax/libs/feather-icons/4.22.1/feather.js"></script>
        <script>
            feather.replace()
        </script>
   
    <!-- Bootstrap core JavaScript-->    
    <script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.js"></script> 
    <script src="./script/jquery-ui.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
        
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
       
    <!-- Page level plugin JavaScript-->        
    <script src="http://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
      
    <!-- 读取JSON文件 scripts for this page--> 
     
    <script src="./json/json_currencyrate.js"></script>  
    <script src="./json/json_freightAir.js"></script>    
    <script src="./json/json_product.js"></script>              
      
    <!-- Demo scripts for this page-->
    <script src="./script/site.js"></script>
    <script src="./script/air_gettable.js"></script>
    <script src="./script/air_handledata.js"></script>


    <script>
      $(document).ready(function(){
  
          $("#airmodalDialog").draggable();//为模态对话框添加拖拽
          $("#airrateModal").css("overflow", "hidden");//禁止模态对话框的半透明背景滚动
  
      })
  </script>
  


  </body>
</html>
